<template>
    <el-row>
        <!-- 头部 -->
        <el-col :span="24">
            <el-card shadow="hover">
                <el-breadcrumb :separator-icon="ArrowRightBold">
                    <el-breadcrumb-item :to="{ path: '/admin_index' }">首页</el-breadcrumb-item>
                    <el-breadcrumb-item>订单管理</el-breadcrumb-item>
                    <el-breadcrumb-item>下分订单</el-breadcrumb-item>
                </el-breadcrumb>
            </el-card>
        </el-col>
        <div style="padding: 5px;"></div>
        <!-- 内容区域 -->
        <el-col :span="24">
            <el-card shadow="hover">
                <template #header>
                    <div style="display: flex; align-items: center;">
                        <el-input style="width: 260px;" v-model="inputval" placeholder="请输入UID、手机、昵称、备注" />
                        <div style="padding: 5px;"></div>
                      <el-select   popper-class="custom-select-dropdown"  style="width: 150px;" v-model="page.status" placeholder="全部">
                        <el-option label="全部" value="0">全部</el-option>
                        <el-option label="待处理" value="1">待处理</el-option>
                        <el-option label="下分成功" value="2">下分成功</el-option>
                        <el-option label="下分失败" value="3">下分失败</el-option>
                      </el-select>
                      <div style="padding: 5px;"></div>
                      <el-date-picker v-model="page.time_date[0]" :default-value="page.time_date[0]" type="datetime" placeholder="开始日期" style="width: 180px;" />
                      <div style="width: 15px"></div>
                      <el-date-picker v-model="page.time_date[1]" :default-value="page.time_date[1]" default-time="12:00:00" type="datetime" placeholder="结束日期" style="width: 180px;" />
                      <div style="padding: 5px;"></div>
                        <el-button type="primary" :icon="Search" @click="inputSearch()">搜索</el-button>
                    </div>
                </template>

                <!-- 表格 -->
                <el-table :data="tableData.list" :border="true" style="width: 100%">
                    <el-table-column prop="id" label="序号" width="80" />
                    <!-- <el-table-column prop="orderid" label="订单ID" width="230" /> -->

                    <el-table-column label="用户详情" width="180">
                        <template #default="scope">
                            <div>UID：{{scope.row.uid}}</div>
                            <div>昵称：{{scope.row.nickname}}</div>
                          <div>手机：{{scope.row.user?.phone}}</div>
                          <div>备注：{{scope.row.user?.remark}}</div>
                    		<div>类型：
                    			<el-tag type="success" v-if="scope.row.role == 0">正常玩家</el-tag>
                    			<el-tag type="danger" v-if="scope.row.role == 1">内部用户</el-tag>
                    		</div>
                        </template>
                    </el-table-column>>

<!--                    <el-table-column label="开户银行">
                        <template #default="scope">
                            <el-tag type="warning">{{ scope.row.bank_name }}</el-tag>
                        </template>
                    </el-table-column>

                    <el-table-column label="银行卡号">
                        <template #default="scope">
                            <el-tag type="warning">{{ scope.row.bank_number }}</el-tag>
                        </template>
                    </el-table-column>

                    <el-table-column label="收款人姓名" width="150">
                        <template #default="scope">
                            <el-tag type="warning">{{ scope.row.bank_username }}</el-tag>
                        </template>
                    </el-table-column> -->

                    <el-table-column label="提现信息" >
                        <template #default="scope">
                            提现金额：<el-tag type="danger">￥{{ scope.row.money }}</el-tag>
                          <div v-if="scope.row.withdrawal_type==1">
                            <div>开户银行：{{scope.row.bank_name}}</div>
                            <div v-if="scope.row.bank_number">银行卡号：{{scope.row.bank_number}}</div>
                            <div v-if="scope.row.bank_username">收款人姓名：{{scope.row.bank_username}}</div>
                          </div>
                          <div v-if="scope.row.withdrawal_type==2">
                            <div>下分方式：{{scope.row.bank_name}}</div>
                            <div v-if="scope.row.bank_number">支付宝账号：{{scope.row.bank_number}}</div>
                            <div v-if="scope.row.bank_username">支付宝姓名：{{scope.row.bank_username}}</div>
                            <div v-if="scope.row.alipay_payment_code" style="display: flex">
                              收款二维码：
                              <el-image
                                style="height:100px"
                                :src="scope.row.alipay_payment_code"
                                :preview-src-list="[scope.row.alipay_payment_code]"
                                :initial-index="0"
                                fit="contain"
                                :preview-teleported="true"
                              />
                            </div>
                          </div>
                          <div v-if="scope.row.withdrawal_type==3">
                            <div>下分方式：{{scope.row.bank_name}}</div>
                            <div v-if="scope.row.bank_username">微信姓名：{{scope.row.bank_username}}</div>
                            <div v-if="scope.row.wechat_payment_code" style="display: flex" >
                              收款二维码：
                              <el-image
                                style="height:100px"
                                :src="scope.row.wechat_payment_code"
                                :preview-src-list="[scope.row.wechat_payment_code]"
                                :initial-index="0"
                                fit="contain"
                                :preview-teleported="true"
                              />
                            </div>
                          </div>


                        </template>
                    </el-table-column>


                    <el-table-column label="用户数据">
                        <template #default="scope">
							<div>今日总流水：{{scope.row.today_liusui}}</div>
                          <div>今日六合彩流水：{{scope.row.lhc_money}}</div>
							<div>今日输赢：{{scope.row.today_yinkui}}</div>

							<div>提现前余额：{{scope.row.money_before}}</div>
                          <div>提现后余额：{{scope.row.money_log.moneys}}</div>
                        </template>
                    </el-table-column>

                    <el-table-column label="订单状态">
                        <template #default="scope">
                            <el-tag type="danger" v-if="scope.row.status == 1">等待处理</el-tag>
                            <el-tag type="success" v-if="scope.row.status == 2">下分成功</el-tag>
                            <el-tag type="warning" v-if="scope.row.status == 3">下分失败</el-tag>
                            <div v-if="scope.row.status == 3">{{scope.row.reason}}</div>
                        </template>
                    </el-table-column>

                    <el-table-column prop="create_time" label="订单时间" />

                    <el-table-column label="订单操作">

                        <template #default="scope">
                          <el-button type="success" :disabled="scope.row.status != 1" @click="admin_walletsave_status(scope.row, 'success')" v-if="role.includes('tongyi')">通过</el-button>
<!--                          <el-button type="danger" :disabled="scope.row.status != 1" @click="admin_walletsave_status(scope.row, 'error')" v-if="role.includes('jujue')">拒绝</el-button>-->
                          <el-button type="danger" :disabled="scope.row.status != 1" @click="admin_walletsave_status_dialog(scope.row, 'error')" v-if="role.includes('jujue')">拒绝</el-button>
                          <el-popconfirm title="确定回滚吗？" @confirm="admin_walletsave_status(scope.row, 'rollback')" v-if="isOneDayAgo(scope.row.create_time) && role.includes('huigui')">
                            <template #reference>
                              <el-button :disabled="scope.row.status == 1" type="success">回滚</el-button>
                            </template>
                          </el-popconfirm>
<!--                          <el-popconfirm title="确定通过吗？" @confirm="admin_walletsave_status(scope.row, 'success')" v-if="role.includes('tongyi')">-->
<!--                                <template #reference>-->
<!--                                    <el-button :disabled="scope.row.status != 1" type="success">通过</el-button>-->
<!--                                </template>-->
<!--                            </el-popconfirm>-->

<!--                            <el-popconfirm title="确定拒绝吗？" @confirm="admin_walletsave_status(scope.row, 'error')" v-if="role.includes('jujue')">-->
<!--                                <template #reference>-->
<!--                                    <el-button :disabled="scope.row.status != 1" type="danger">拒绝</el-button>-->
<!--                                </template>-->
<!--                            </el-popconfirm>-->

                            <!-- <el-button type="warning" @click="formSubmitEdit(scope.row)">提现信息</el-button> -->
                        </template>



                    </el-table-column>

                </el-table>
                <!-- 分页 -->

                <div style="padding: 10px;"></div>
                <el-pagination small background v-model:currentPage="page.pagenum" v-model:page-size="page.pagesize"
                    :page-sizes="[20, 50]" :small="small" :background="background" layout="total, prev, pager, next, jumper"
                    :total="page.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />

            </el-card>
        </el-col>
    </el-row>


    <!-- 修改提现信息 -->
    <el-dialog v-model="wallDialog" title="修改提现信息" center width="38%" :destroy-on-close="true">
        <el-form label-width="100px">

            <el-form-item label="用户名">
                <el-input v-model="foemData.nickname" :disabled="true" />
            </el-form-item>
            <el-form-item label="开户银行">
                <el-input v-model="foemData.bank_name" />
            </el-form-item>

            <el-form-item label="银行卡号">
                <el-input v-model="foemData.bank_number" />
            </el-form-item>

            <el-form-item label="收款人姓名">
                <el-input v-model="foemData.bank_username" />
            </el-form-item>

        </el-form>

        <template #footer>
            <el-button type="primary" @click="admin_wallettake_edit()">确定</el-button>
        </template>
    </el-dialog>

  <el-dialog v-model="jjDialog" title="填写拒绝理由" center width="38%" :destroy-on-close="true">
    <el-form label-width="100px">

      <el-form-item label="拒绝理由">
        <el-input  type="textarea" v-model="reasonDate.reason"/>
      </el-form-item>

    </el-form>

    <template #footer>
      <el-button type="primary" @click="admin_walletsave_status(reasonDate,reasonDate.type)" :disabled="isTj">确定</el-button>
    </template>
  </el-dialog>
</template>



<script setup>

import { ref, reactive, onMounted } from 'vue'
import { request_post } from '@/common/axios/request.js'
import { success, error } from '@/common/tool/message.js'
import { ArrowRightBold, UserFilled, Search } from '@element-plus/icons-vue'
import {ElMessageBox} from "element-plus";


const tableData = reactive({ list: [] })

const foemData = reactive({
    id: '',
    nickname:'',
    bank_name: '',
    bank_number: '',
    bank_username: '',
})

const role = ref([]);
onMounted(() => {
  admin_wallettake_order()
  const list = JSON.parse(window.localStorage.getItem('menus_data'))
  let menu = [];
  for(let key in list){
    if(list[key].name=='订单管理'){
      menu = list[key]
    }
  }
  console.log(menu,'menu');
  let child = [];
  for(let i in menu.children){
    if(menu.children[i].name=='下分订单'){
      child = menu.children[i]
    }
  }
  let roleArr =[];

  for(let i in child.children){
    roleArr.push(child.children[i].role)
  }
  role.value = roleArr
})

function isOneDayAgo(targetTime) {
  if (!targetTime) return false;

  const now = new Date();
  const target = new Date(targetTime);

  // 计算两个时间的毫秒差
  const timeDiff = now - target;

  // 一天的毫秒数
  const oneDayInMs = 24 * 60 * 60 * 1000-5*60*1000;

  // 判断时间差是否大于等于一天
  return timeDiff <= oneDayInMs;
}

// 判断当前时间是否在 23:55 之后
function isAfter2355() {
  const now = new Date();
  const hours = now.getHours();
  const minutes = now.getMinutes();
  return hours > 23 || (hours === 23 && minutes >= 55);
}


// 搜索 
const inputval = ref('')
const wallDialog = ref(false)
function inputSearch() {
    // if (inputval.value == '') {
    //     return error('请输入代理UID')
    // }
    page.uid = inputval.value
    admin_wallettake_order()
}

// 编辑
function formSubmitEdit(item) {
    wallDialog.value = true
    foemData.id = item.id
    foemData.nickname = item.nickname
    foemData.bank_name = item.bank_name
    foemData.bank_number = item.bank_number
    foemData.bank_username = item.bank_username
}

function admin_wallettake_edit() {
    request_post('/admin_wallettake_edit', foemData).then((res) => {
         console.log(res)
        if (res.data.code == 200) {
            wallDialog.value = false
            admin_wallettake_order()
            return success(res.data.msg)
        } else {
            return error(res.data.msg)
        }
    })
}

// 获取用户列表
function admin_wallettake_order() {

    request_post('/admin_wallettake_order', page).then((res) => {

        if (res.data.code == 200) {
            tableData.list = res.data.data.data
            page.total = res.data.data.total
        } else {
            return error(res.data.msg)
        }
    })

}

const jjDialog = ref(false);
const reasonDate = reactive({
  id:0,
  type:'error',
  reason:'',
})
function admin_walletsave_status_dialog(item, type) {
  reasonDate.id = item.id;
  reasonDate.type = type;
  reasonDate.is_bxt = item.is_bxt;
  console.log(reasonDate,'reasonDate');
  jjDialog.value = true;
}


let submitLock = false

const isTj = ref(false);
function admin_walletsave_status(row, type) {
  if(isTj.value==true){
    return false
  }
  isTj.value = true;

  let content = '确定通过吗？';
  if(type=='error'){
    content = '确定拒绝吗？';
  }
  if(type=='rollback'){
    content = '确定回滚吗？';
  }
  if(row.is_bxt==1 && type=='success'){
    content = "当前下分用户取款名姓名与上次姓名不一致，请认真核实此次下分订单的是否由本人操作下分，避免造成损失！"
  }
  ElMessageBox.confirm(content,'系统提示', {
    confirmButtonText: '确定',
    type: 'warning',
    callback: action => {

      console.log(action,'action');

      if(action=='confirm'){
        if(submitLock) return
        submitLock = true
        const id = row.id

        request_post('/admin_wallettake_status', {id, type,reason:reasonDate.reason }).then((res) => {
          setTimeout(()=>{
            submitLock = false
          }, 500)
          if (res.data.code == 200) {
            admin_wallettake_order()
            jjDialog.value = false;
            isTj.value  = false
            return success(res.data.msg)
          } else {
            admin_wallettake_order()
            jjDialog.value = false;
            isTj.value  = false
            return error(res.data.msg)
          }
        })
      }

    }
  });


}
var now_date = new Date();
var now_date2 = new Date();
var year = now_date.getFullYear();
var month = now_date.getMonth() + 1; // 月份从0开始，所以要加1
var day = now_date.getDate();
now_date.setHours(23, 59, 59);
now_date2.setHours(0,0,0)
const page = reactive({
    uid: '',
  status:"0",
  time_date:[
    now_date2,now_date
  ],
    pagenum: 1,
    pagesize: 18,
    total: 0
})

function handleSizeChange(val) {
    page.pagenum = val
    admin_wallettake_order()
}
function handleCurrentChange(val) {
    page.pagenum = val
    admin_wallettake_order()
}


</script>

<style>
.fl-img{
  position: absolute;
  right: 10px;
  top: 0;
  display: flex;
  align-items: center;
  bottom: 0;
}
</style>
